﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link href="styles/index.css" rel="stylesheet" />
    <title>mobile</title>
</head>
<body>
    <div id="header">
        <h1>ProjetIHM</h1>
    </div>
    <div id="sectionGENERAL">
    <div id="section">
        <div class="tuile"></div>
        <div class="tuile"></div>
        <div class="tuile"></div>
        <div class="tuile"></div>
        <div class="tuile"></div>
        <div class="tuile"></div>
        <div class="tuile"></div>
        <div class="tuile"></div>
        <div class="tuile"></div>
        <div class="tuile"></div>
        <div class="tuile"></div>
        <div class="tuile"></div>
        <div class="tuile"></div>
        <div class="tuile"></div>
        <div class="tuile"></div>
        <div class="tuile"></div>
        <div class="tuile"></div>
        <div class="tuile"></div>
        <div class="tuile"></div>
    </div>
        </div>
    <script src="scripts/jquery-1.8.3.min.js"></script>
    <script type="text/javascript">
        var iScroll = 0;
        var lastScroll = 0;
        window.alert("ici");
        $('#section').bind('mousewheel', function (event, delta) {

            $(this).scrollLeft(100 * -delta + (100 * iScroll));

            //Si a la fin
            if (!($(this).scrollLeft() == lastScroll)) {
                iScroll += -delta;
            }
            lastScroll = $(this).scrollLeft();

            event.stopPropagation();
        });
    </script>
</body>
</html>
